/**
 * 以下所有参数都是可选形式，内部实现中都赋予了默认值
 * @param {String} opt.content 内嵌的html
 * @param {String} opt.title 标题
 * @param {Array} opt.buttons 按钮数组，格式[{text:'...',callback:function(){}},...]
 * @param {Number} opt.width 对话框宽度，默认500
 * @param {Number} opt.height 对话框高度，默认300
 */
var Dialog = (function() {

	var _id = 1;

	var Dialog = function(opt) {
		var _this = this;
		opt = opt || {};

		_this._id = _id++;

		_this.width = opt.width || 500;
		_this.height = opt.height || 300;
		_this.title = opt.title || '温馨提示';
		_this.content = opt.content || '';

		_this.btns = opt.btns || [];

		_this.mask = $('<div class="mask"></div>').attr({
			id: ['dialog', _this._id, 'mask'].join('_')
		}).css({
			'margin': '0',
			'padding': '0',
			'border': 'none',
			'width': '100%',
			'height': '100%',
			'background': '#333',
			'opacity': '0.6',
			'filter': 'alpha(opacity=60)',
			'z-index': '9999',
			'position': 'fixed',
			'top': '0',
			'left': '0',
			'display': 'none'
		});

		var _tmpl = $([
			'<div>',
			'    <div class="title">',
			'        ' + _this.title + '<a href="javascript:void(0)" title="关闭窗口" class="close_btn">×</a>',
			'    </div>',
			'	 <center class="dialog_content">',
				 _this.content,
			'	 </center>',
			'    <div class="bottom">',
			'		<center>',
			'		</center>',
			'	 </div>',
			'</div>'
		].join(''));

		_this.dialog = $(_tmpl).attr({
			'id': ['dialog', _this._id].join('_')
		}).css({
			'width': _this.width,
			'height': _this.height,
			'left': ($(window).width() - _this.width) / 2,
			'top': ($(window).height() - _this.height) / 2
		});

		_this._addition();

		$(window).resize(function() {
			_this.resize();
		});

		return _this;

	};

	Dialog.prototype.resize = function() {
		var _this = this;
		_this.dialog.css({
			'left': ($(window).width() - _this.width) / 2,
			'top': ($(window).height() - _this.height) / 2
		});
	};

	Dialog.prototype._addition = function() {
		var _this = this;
		_this.dialog.css({
			'position': 'fixed',
			'background': 'white',
			'border': '5px solid #191919',
			'border-radius': '7px',
			'z-index': '10000',
			'display': 'none'
		});

		var title = _this.dialog.find('.title').css({
			'background': '#f7f7f7',
			'padding': '0px 20px',
			'line-height': '50px',
			'height': '50px',
			'font-weight': 'bold',
			'color': '#666',
			'font-size': '20px'
		});		

		_this.dialog.find('.close_btn').css({
			'font-family': 'arial',
			'font-size': '30px',
			'font-weight': '700',
			'color': '#999',
			'text-decoration': 'none',
			'float': 'right',
			'padding-right': '4px'
		}).on('click', function() {
			var href = $(this);
			var dialog = href.parent().parent();
			var id = dialog.attr('id');
			dialog.remove();
			$('#' + [id, 'mask'].join('_')).remove();
		});

		_this.dialog.find('.row').css({
			'height': '77px',
			'line-height': '77px',
			'padding': '0px 30px',
			'font-family': '华文楷体',
			'font-size': 'x-large'
		});

		var bottom = _this.dialog.find('.bottom').css({
			'padding': '0px 0px',
			'line-height': '50px',
			'height': '50px',
			'margin': '0px auto',
			'position': 'absolute',
			'bottom': '0px',
			'left':(_this.width - (_this.btns.length * 100))/2
		});

		$.each(_this.btns, function(i, v) {
			bottom.find('center').append($('<a href="javascript:void(0)" class="btn"></a>').text(v.text).on('click', v.callback));
		});

		_this.dialog.find('.btn').css({
			'color': 'White',
			'background': '#dd2a29',
			'text-decoration': 'none',
			'border-radius': '5px',
			'height': '30px',
			'line-height': '30px',
			'width': '100px',
			'text-align': 'center',
			'bottom': '10px',
			'margin-right': '10px'
		});

		setTimeout(function(){
			var content = _this.dialog.find('.dialog_content');
			content.css({
				'margin-top':(_this.height - title.height() - bottom.height() - content.height())/2
			});
		},0);
	};

	Dialog.prototype.show = function() {
		var _this = this;
		$('body').append(_this.mask);
		$('body').append(_this.dialog);
		_this.showMask();
		_this.showDialog();

		return _this;
	};

	Dialog.prototype.showMask = function() {
		var _this = this;
		_this.mask.show();

		return _this;
	};

	Dialog.prototype.hideMask = function() {
		var _this = this;
		_this.mask.hide();

		return _this;
	};

	Dialog.prototype.showDialog = function() {
		var _this = this;
		_this.dialog.show();

		return _this;
	};

	Dialog.prototype.hideDialog = function() {
		var _this = this;
		_this.dialog.hide();

		return _this;
	};

	Dialog.prototype.remove = function() {
		var _this = this;
		_this.mask.remove();
		_this.dialog.remove();
	};


	return Dialog;

})();